{% extends "base.html" %}
{% block title %}Dashboard导航页{% endblock %}
{% block contentheader %}{% endblock %}
{% block contentsmallheader %}{% endblock %}
{% block head %}
    <style>
        div.img {
            width: 250px;
            height: 170px;
            margin: 1px;
            overflow: hidden;
            padding: 5px;
        }

        img.bigger {
            width: 100%;
            height: 100%;
            transition: transform 2s;
            margin: 0px;
        }

        img.bigger:hover {
            transform: scale(1.2, 1.2);
        }
    </style>
{% endblock %}
{% block content %}
    <div class="row">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <div class="img col-md-3">
                <a href="http://172.19.100.12:7180/cmf/home" target="_blank">
                    <img class="bigger" 
                         src="static/img/cdh_on.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://hadoop22.bs.ppcredit.com:8888/hbase/" target="_blank">
                    <img class="bigger" 
                         src="static/img/hbase_on.jpg"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://hadoop22.bs.ppcredit.com:8888/beeswax/" target="_blank">
                    <img class="bigger" 
                         src="static/img/hive_on.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://172.19.100.29:8089/#/" target="_blank">
                    <img class="bigger" 
                         src="static/img/kafkamonitor_on.png"
                         alt="">
                </a>
            </div>
<div class="img col-md-3">
                <a href="http://192.168.213.23:7180/cmf/home" target="_blank">
                    <img class="bigger" 
                         src="static/img/cdh_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://hadoop33.sc.ppcredit.com:8888/hbase/#HBase" target="_blank">
                    <img class="bigger" 
                         src="static/img/hbase_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://hadoop33.sc.ppcredit.com:8888/beeswax/" target="_blank">
                    <img class="bigger" 
                         src="static/img/hive_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://192.168.213.34:8090/#/" target="_blank">
                    <img class="bigger" 
                         src="static/img/kafkamonitor_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://192.168.213.34:8787/" target="_blank">
                    <img class="bigger"
                         src="static/img/rtudio_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://192.168.213.32:7777/#/" target="_blank">
                    <img class="bigger"
                         src="static/img/zeppelin_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://192.168.213.34:7070/kylin/login" target="_blank">
                    <img class="bigger"
                         src="static/img/kylin_off.png"
                         alt="">
                </a>
            </div>
            <div class="img col-md-3">
                <a href="http://192.168.213.34:9999/tree" target="_blank">
                    <img class="bigger"
                         src="static/img/jupyter_off.png"
                         alt="">
                </a>
            </div>
        <div class="col-md-2"></div>
    </div>
{% endblock %}
{% block script %}
    <script type="text/javascript">
        function add_class() {
            console.log('这就是个欢迎页，啥也没有......')
        }
    </script>
{% endblock %}